import echarts from 'echarts'
/**
 * echartsId id元素
 * color颜色
 * title 标题
 * legendText  图例组件名字
 * Xdata
 * series
 */
export function echartsLineFunc (echartsId, color, title, legendText, Xdata, series, grid, unit, xUnit) {
  let myChart = echarts.init(document.getElementById(echartsId))
  let option = {
    color: color,
    grid: grid,
    tooltip: {
      trigger: 'axis'
    },
    title: {
      text: title,
      top: 5,
      x: 'center',
      textStyle: {
        fontSize: 14,
        color: '#333333',
        fontWeight: 400
      }
    },
    legend: legendText,
    xAxis: {
      axisTick: { show: false },
      name: xUnit,
      nameTextStyle: {
        color: '#999999',
        fontSize: 12,
        padding: [35, 30, 5, 0]
      },
      axisLine: {
        lineStyle: {
          type: 'solid',
          color: '#E1E1E1',
          width: '1',
          opacity: 0.27
        }
      },
      axisLabel: {
        textStyle: {
          color: '#999999',
          fontSize: 12
        }
      },
      type: 'category',
      // boundaryGap: false,
      data: Xdata
    },
    yAxis: {
      type: 'value',
      name: unit,
      nameTextStyle: {
        color: '#999999',
        fontSize: 14
      },
      axisTick: { show: false },
      nameGap: 10,
      splitLine: {
        lineStyle: {
          type: 'dashed',
          color: '#E1E1E1',
          with: '1'
        }
      },
      axisLabel: {
        show: true,
        interval: 'auto',
        formatter: '{value}',
        textStyle: {
          color: '#999999',
          fontSize: 12
        }
      },
      axisLine: { show: false }
    },
    series: series
  }

  //先清除
  myChart.clear();
  myChart.setOption(option)
  window.addEventListener('resize', function () {
    myChart.resize()
  })
}
